import React from 'react';
import { inject, observer } from 'mobx-react';
import { Modal, message, Button, Tag,Spin } from "antd";

import {  WeaTop, WeaRightMenu, WeaTab, WeaReqTop, WeaDialog, WeaTag,WeaAlertPage,WeaDatePicker,WeaFormItem,WeaError} from 'ecCom';


@inject("infoWordMergeStore")
@observer
class infoWordMerge extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
        }
    }

    componentDidMount() {
        const { journalid } = this.props.location.query;
        const {infoWordMergeStore} = this.props;
        infoWordMergeStore.getInfoWordMergeDetail({"journalid":journalid});
       
    }

    componentWillReceiveProps(nextProps) {
        const {infoWordMergeStore} = this.props;
        if (this.props.location.key !== nextProps.location.key) {
            const { journalid } = nextProps.location.query;
            infoWordMergeStore.getInfoWordMergeDetail({"journalid":journalid});
        }
    }

    getTopButtons = () => {
        const {infoWordMergeStore} = this.props;
        let btns = [];
        btns.push(
            infoWordMergeStore.getTopButton()
        )
        return btns;
    }
    
    render() {
        const { infoWordMergeStore} = this.props;
        const {loadingSpin,title, status: {loading,cbsjVisible},src,setState,cbsjtemp,changeCbsj} = infoWordMergeStore;
        const rightMenu = infoWordMergeStore.getRightMenu();
        if (loadingSpin) {
            return <div className="h100" style={{ textAlign: 'center', paddingTop: '300px' }}><Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@rcjt41`} size="large"/></div>
        }
        let hideObject = false;
        let iframestyle =  (!!window.ActiveXObject || "ActiveXObject" in window) ?
        { display: ( hideObject) ? "none" : "", width: '80%', backgroundColor: '#fff', margin: '30px 10% 0 10%' }
        :
        { height: ( hideObject) ? "1px" : "100%", width: '80%', backgroundColor: '#fff', margin: '30px 10% 0 10%' }
        return (
            <div>
                <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@5qvups`}
                    datas={rightMenu}>

                    <div>
                        <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@dgpxwm`}
                            title={title}
                            icon={<i className='icon-coms-government' />}
                            iconBgcolor='#f14a2d'
                            loading={loading}
                            buttons={this.getTopButtons() }
                            showDropIcon={true}
                            dropMenuDatas={rightMenu}
                            >
                            <div style={iframestyle}>
                                <iframe
                                    id="hideIframe"
                                    width='100%'
                                    height={( hideObject) ? '1px' : '850px'}
                                    frameborder="no"
                                    border="0"
                                    name="hideIframe"
                                    src={src}
                                /></div>
                        </WeaTop>
                        <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@lklbhn`}
                                title={'信息确认'}
                                icon="icon-coms-government"
                                iconBgcolor='#f14a2d'
                                visible={cbsjVisible}
                                style={{ width: 400, height: 80 }}
                                onCancel={() => setState({ cbsjVisible: false })}
                                buttons={[
                                    (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@aotfxw@submit}`} type="primary" onClick={()=>{ this.updateCBSJ() }}>确认</Button>),
                                    (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@zg8di7@cancel`} type="ghost" onClick={()=>setState({ cbsjVisible: false })}>取消</Button>),
                                ]}
                            > 
                            <div className="info-wea-form-item-group">
                                <WeaFormItem
                                    label="出版日期"
                                    labelCol={{span: 6}}
                                    wrapperCol={{span: 18}}
                                    viewAttr={3}
                                >
                                     <WeaError tipPosition='bottom'
                                        ref='infoweaError'
                                        error='出版日期必填'>
                                        <WeaDatePicker
                                            value={cbsjtemp}
                                            viewAttr={3}
                                            onChange={value => changeCbsj(value)}
                                        />
                                    </WeaError>
                                   
                                </WeaFormItem>
                            </div>
                            
                               
                            </WeaDialog>
                    </div>
                </WeaRightMenu>
            </div>
        )
    }
    updateCBSJ=()=>{
        const { infoWordMergeStore} = this.props;
        const { updateCBSJ,cbsjtemp } = infoWordMergeStore;
        if(cbsjtemp === ''){
            this.refs.infoweaError.showError();
        }else{
            updateCBSJ();
        }
    }
}

export default infoWordMerge ;